<template>
    <div class="detail_body">
        <div class="nav_header">
            <mu-appbar color="primary">
                <mu-button icon slot="left" @click="$router.go(-1)">
                    <mu-icon value="keyboard_arrow_left"></mu-icon>
                </mu-button>
                一日猫
            </mu-appbar>
        </div>
        <div class="container_body">
            <div class="demo-paper" :z-depth="1">
                <mu-carousel transition="fade">
                    <mu-carousel-item>
                        11
                        <!-- <img :src=""> -->
                    </mu-carousel-item>
                    <mu-carousel-item>
                        22
                        <!-- <img :src=""> -->
                    </mu-carousel-item>
                    <mu-carousel-item>
                        33
                        <!-- <img :src=""> -->
                    </mu-carousel-item>
                    <mu-carousel-item>
                        44
                        <!-- <img :src=""> -->
                    </mu-carousel-item>
                </mu-carousel>
            </div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "DailyDetail",
        data() {
            return {
                routeId: this.$route.params.id,
                detailArr: {}
            }
        },
        mounted() {
            this.getdata();
            console.log(this.$route.params.id) //获取路由参数
        },
        methods: {
            getdata() {
                var _self = this; //确保下面使用ajax时候this指向正确
                this.$http.get('https://www.easy-mock.com/mock/5b19f530b97c8172c435c38b/dailyCats/query').then(function(r) {
                    var  detailData = r.data.data.data;
                    console.log(detailData)
                    _self._.map(detailData,function(v,i){
                      console.log(i)
                    })
                    // for (var i = 0; i < detailData.length; i++) {
                    //     if (detailData[i].id = _self.routeId) {
                    //         _self.detailArr = detailData[i];
                    //     }
                    // }
                }).catch(function(e) {})
            }
        },
    }
</script>

<style lang="less" scoped>
    .material-icons {
        font-size: 40px;
    }
    .detail_body {
        height: 100%;
    }
    .container_body {
        height: calc(100% - 112px);
        padding: .3rem;
        .demo-paper {
            height: 92%;
            background-color: #fff;
            border: 1px solid #eeeeee;
            border-radius: .1rem;
        }
    }
</style>


